<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>存储复杂数据类型</title>
</head>
<body>
<h2>存储复杂数据类型</h2>
<p>本地只能存储字符串,无法存储复杂数据类型</p>
<p>
    解决：需要将复杂数据类型转换成 JSON字符串,在存储到本地 <br>
    语法：JSON.stringify(复杂数据类型) <br>
</p>
<p>将复杂数据转换成JSON字符串 存储 本地存储</p>
<hr>

<p> 问题：因为本地存储里面取出来的是 字符串，不是对象，无法直接使用</p>
<p>
    解决：把取出来的字符串转换为 对象 <br>
    语法：JSON.parse(JSON字符串)
</p>
<p></p>
<p>将JSON字符串转换成对象 取出 时候使用</p>
<hr>

<script>

    // 声明一个对象
    const 对象_个人信息 = {
        姓名: '孙新罡',
        年龄: 38,
        性别: '男'
    }

    // 存储 复杂数据类型,  这里是把 对象存储到 本地存储
    // localStorage.setItem('密钥', 对象_个人信息)
    // 值是 [object Object], 无法直接使用. 到浏览器本地存储里看值

    // --------------------------------------------------------------------

    // 像对象这种 复杂数据类型, 要转换成为 JSON数据 存储
    let JSON类型_对象数据 = JSON.stringify(对象_个人信息)
    console.log(typeof JSON类型_对象数据) // 简称数据类型是什么?  字符串类型

    localStorage.setItem('密钥2', JSON类型_对象数据) // 在把JSON类型数据, 存储 本地存储


    // 取值, JSON类型数据也是 字符串, 先取字符串
    let 对象数据 = localStorage.getItem('密钥2')
    console.log(JSON.parse(对象数据)) // 把字符串在转换成为 对象.  控制台看信息


    // 说明下: 实际还是转换成为字符串存储, 使用时提取字符串 转换原来的类型
    // 对象, 数组 都是可以, 这种存储 (对象里的方法,即函数不行)
</script>
</body>
</html>